@import 'src/variables';
@import '~le5le-ui/variables';

$color-border: #ddd;

:host {
  display: block;
  background-color: #e7e7e7;
  width: 100vw;
  height: 100%;
  padding: 0 0.3rem;
  overflow: auto;

  & > div {
    max-width: 12rem;
    margin: auto;
  }
}

.nav {
  margin: 0.2rem 0.1rem 0.05rem 0.1rem;
}

.gray {
  color: #aaa;
}

.topo {
  position: relative;
  width: calc(25% - 0.2rem);
  height: 3rem;
  margin: 0.1rem;
  border-radius: 2px;
  background-color: #fff;

  .image {
    padding: 0.1rem;
    text-align: center;
    background-color: rgba(204, 204, 204, 0.18);
    height: 1.95rem;
    cursor: pointer;

    img {
      height: 100%;
    }
  }

  .title {
    font-size: 0.14rem;
    line-height: 0.2rem;
    height: 0.2rem;
    cursor: pointer;
  }

  .desc {
    font-size: 0.12rem;
    line-height: 0.16rem;
    height: 0.32rem;
  }

  .iconfont {
    font-size: $font-size;
  }

  textarea {
    &.input {
      min-width: 0.3rem;
      width: 100%;
      max-width: 100%;
      font-size: 0.1rem;
      padding: 0.02rem 0.05rem;
      resize: none;
    }
  }

  .icon-delete {
    position: absolute;
    top: 0.05rem;
    right: 0.1rem;
  }
}
